let data = {
    pagenum: 1,
    pagesize: 2
}


function getUserList() {
    $.ajax({
        type: 'get',
        url: '/admin/users',
        data: data,
        success: function (res) {
            if (res.status === 0) {
                showPage(res.total)
                let str = ''
                res.data.forEach(item => {
                    str += `<tr>
                        <td>${item.id}</td>
                        <td>${item.username}</td>
                        <td>${item.nickname}</td>
                        <td>${item.email}</td>
                        <td> 
                        <a href="./edit.html?id=${item.id}" class="layui-btn layui-btn-xs">编辑</a>
                        <button type="button" class="layui-btn layui-btn-xs layui-btn-danger del" data-id = '${item.id}'>删除</button>
                        <button type="button" class="layui-btn layui-btn-xs layui-btn-normal reset"  data-id = '${item.id}'>重置密码</button>
                        </td>
                    </tr>`
                });
                //  渲染到表格
                $('tbody').html(str)
            }
        }
    })
}

// 加载分页模块

function showPage(total) {
    let laypage = layui.laypage
    // 初始化分页效果
    laypage.render({
        elem: 'articlePage',
        // 当前页码
        curr: data.pagenum,
        count: total,
        limit: data.pagesize,
        limits: [2, 5, 30, 40, 100],
        // 分页条布局效果
        layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],

        jump: function (obj, first) {
            // obj 表示分页的所有参数；first用于判断首次加载
            // 这里触发时，需要修改当前页码
            data.pagenum = obj.curr
            // 切换每页显示条数时，修改pagesize
            data.pagesize = obj.limit
            // 重新加载接口数据
            if (!first) {
                // 首次不触发，切换页码时触发
                getUserList()
            }
        },

    });
}

getUserList()

// 删除

$('tbody').on('click', '.del', function () {
    let id = $(this).data('id')
    // console.log(id);
    layer.confirm('确认删除该用户吗？', function () {
        $.ajax({
            type: 'delete',
            url: '/admin/users/' + id,
            success: function (res) {
                layer.msg(res.message)
                if (res.status === 0) {
                    // console.log($('tbody').children().length)
                    let len = $('tbody').children().length
                    if (len === 1) {
                        data.pagenum--
                    }
                    getUserList()
                }
            }
        })
    })
})


// 重置密码弹框
$('tbody').on('click', '.reset', function () {
    let id = $(this).data('id')

    let index = layer.open({
        type: 1,
        title: '重置密码',
        content: $('#repwd-form-tpl').html(),
        area: ['500px', '250px']
    })

    // 重置密码
    $('#repwd-form').on('submit', function (e) {
        e.preventDefault()
        // console.log(111);
        $.ajax({
            type: 'put',
            url: '/admin/users/' + id,
            data: {
                password: $('.pwd').val()
            },
            success: function (res) {
                // console.log(res);
                layer.msg(res.message)
                layer.close(index)
            }
        })
    })
})